<template>
  <view class="content">
    <!-- 标题 -->
    <view class="content-title">
    <text> {{newsdetails.titleName}}</text>
    </view>
    <!-- 时间 -->
    <view class="content-time">
      <text>{{newsdetails.createTime}}</text>
    </view>
    <!-- 图片 -->
    <view class="content-photo">
      <image :src="newsdetails.coverUrl" mode="" style="width: 100%; height: 100%;"></image>
    </view>
    <!-- 文章内容 -->
    <view class="content-body" v-html="newsdetails.newsContent">
 
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
      thisId:'',
      newsdetails:{}
      };
    },
    onLoad(options) {
       this.thisId = options.id
      // console.log(options.id)
      this.getNewsData()
    },
    methods:{
    async  getNewsData() {
       const { data } = await uni.$http.get('/news/findById?id=' + this.thisId) 
       console.log('我是数据' , data)
       if(data.statusCode !== 200 ){
         return
       }else{
         this.newsdetails = data.data
         console.log('我是数据===>' , this.newsdetails)
       }
      }
    }
  }
</script>

<style lang="scss" scoped>
  .content {
    // width: 100%;
    // height: 100%;
    padding: 20rpx 0;
    .content-title {
      height: 80rpx;
      padding: 0 20rpx;
      display: flex;
      align-items: center;
      color: #000000;
      font-size: 28rpx;
      font-weight: 700;
    }
    .content-time {
      padding: 0 20rpx;
      font-size: 22rpx;
      margin-top: 20rpx;
      color: #ccc;
    }
    .content-photo {
      width: 100%;
      height: 300rpx;
      margin-top: 20rpx;
    }
    .content-body {
       padding: 0 30rpx;
       overflow: hidden;
    }
  }
</style>
